<template>
	<view class="content">
		<view class="store-list">
			<view class="store-item" v-for="(item,index) in storeList" :key="index">
				<view class="store-name">{{item.shop_name}} <text class="distance">{{item.distance}}km</text> </view>
				<view class="discount-text flexWarpColumn" :class="{flex:item.discount_json.length==1}">
					<view class="all-discount">全天{{Number(item.discount/10)}}折</view>
					<view class="discount-lable" v-for="(k,i) in item.discount_json" :key="i" v-if="item.discount_json.length!=0">
						{{k.starTime}}-{{k.endTime}} <text style="margin-left: 10upx;">{{Number(k.discount/10)}}</text>折优惠
					</view>
				</view>
			</view>
			<uni-load-more v-if="showLoadStatus" :status="status" :size="10" :content-text="contentText" />
		</view>
	</view>
</template>

<script>
	import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue'
	export default {
		components: {
			uniLoadMore
		},
		data() {
			return {
				//下拉刷新
				page: 1,
				size:10,
				showEmpty: true,
				showLoadStatus: false,
				more: true,
				contentText: {
					contentdown: '上拉加载更多~',
					contentrefresh: '加载中...',
					contentnomore: '已经到底了~~'
				},
				status: 'loading',
				storeList:[]
			};
		},
		onLoad() {
			this.freshList();
		},
		// 触底刷新
		onReachBottom() {
			if (this.more) {
				this.getData()
			}
		},
		// 下拉刷新
		onPullDownRefresh: function() {
			this.freshList();
			this.$tools.loadIng()
			setTimeout(() => {
				uni.stopPullDownRefresh()
			}, 500)
		},
		methods: {
			// 刷新列表
			freshList() {
				this.page = 1
				this.more = true
				this.status = 'loading'
				this.storeList = []
				this.getData();
			},
			// 获取订单数据
			getData(){
				let self=this
				this.$request.post(this.$api.rechargeStoreList, {
					page:this.page++,
					num:this.size,
					lon:uni.getStorageSync('longitude')||"106.540541",
					lat:uni.getStorageSync('latitude')||"29.590991",
					store_id:uni.getStorageSync('store_id'),
				}, {
					token:true
				}).then(res => {
					if (res.code == 1) {
						let {
							data = {}
						} = res;
						let newArray =data
						if (newArray.length == 0 && self.page == 2) {
							self.showEmpty = true
							self.showLoadStatus = false
							self.more = false // 不能再次请求了
							return false;
						} else {
							self.showLoadStatus = true
							self.more = true
							self.showEmpty = false
							self.status = 'loading'
						}
						if (newArray.length < this.size) { // 说明没有更多数据
							self.status = 'noMore'
							self.more = false
							self.showEmpty = false
						}
						self.storeList=self.storeList.concat(newArray);
					}
				}).finally(() => {
					setTimeout(()=>{
						this.$tools.hideLoading()
					}, 1000)
				})
			},
		}
	}
</script>

<style lang="scss">
	.content{
		padding: 36upx;
	}
	.flex{
		flex-direction:row !important;
		display: flex;
	}
	.store-list{
		margin-top: 44upx;
		.store-item{
			padding: 26upx;
			background:#232428;
			border-radius: 16rpx 16rpx 16rpx 16rpx;
			font-size: 32rpx;
			font-family: PingFang SC-Medium, PingFang SC;
			font-weight: 500;
			color: #FFFFFF;
			margin-bottom: 20upx;
			.store-name{
				font-size: 28rpx;
				font-family: PingFang SC-Medium, PingFang SC;
				font-weight: 500;
				color: #919294;
				margin-bottom: 10upx;
				.distance{
					font-size: 24rpx;
					margin-left: 10upx;
				}
			}
			.all-discount{
				font-size: 22rpx;
				line-height: 50upx;
				margin-right: 20upx;
			}
			.discount-lable{
				font-size: 22rpx;
				line-height: 50upx;
			}
		}
	}
</style>
